<template>
  <div class="app-container">
    <el-form ref="form" :model="dictionary" :rules="rules" label-width="80px">

      <el-form-item label="选择级别" prop="lev">
        <el-radio-group v-model="dictionary.lev" @change="getParentList">
        <el-radio  :label=1 :value="1">一级</el-radio>
        <el-radio  :label=2 :value="2">二级</el-radio>
        <el-radio  :label=3 :value="3">三级</el-radio>
        </el-radio-group>
      </el-form-item>

      <el-form-item label="上级菜单" prop="select" v-if="dictionary.lev!==1">
        <el-select v-model="select" placeholder="请选择上级" clearable :disabled="dictionary.lev===1">
          <template v-for="(classification,index) in parentList">
            <el-option :value="classification.id"
                       :label="dictionary.lev===1?'无上级':classification.text"
                       :key="index"
          ></el-option>
          </template>
        </el-select>
      </el-form-item>



      <el-form-item label="是否启用" prop="isdisable">
        <el-radio-group v-model="dictionary.isdisable" >
        <el-radio  :label=1 >启用</el-radio>
        <el-radio  :label=0 >禁用</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="字典文本" prop="text">
        <el-input v-model="dictionary.text" style="width: 200px"></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary"  @click="SaveOrUpdate('form')">保存</el-button>

        <el-button type="primary" icon="el-icon-delete" @click="jumpBack">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
  import api_basic_setting from "@/api/dictionary";
  import dictionary from "../../api/dictionary";
  export default {
    name: "save_dictionary",
    data() {
      const selectRules = (rule, value, callback) => {
        if (this.dictionary.lev !== 1 && this.select === '') {
          callback(new Error('请选择上级'));
        } else if (this.dictionary.lev === 1) {
          callback();
        } else {
          callback();
        }
      };
      return {
        totalList: [],
        parentList: [],
        parentText: '请选择上级',
        dictionary: {
          pid: '',
          text: '',
          isdisable: -1,
        },
        select: '',
        rules: {
          text: [{required: true, message: '请填写字典文本', trigger: 'change'}],
          lev: [{required: true, message: '请选择级别', trigger: 'change'}],
          isdisable: [{required: true, message: '请选择是否启用', trigger: 'change'}],
          select: [{validator: selectRules, trigger: 'change'}],
        }
      }
    },
    created() {
      this.init()
    },
    watch: {
      $route(to, form) {
        this.init();
      },


    },
    methods: {
      init() {
        if (this.$route.params && this.$route.params.id) {
          const id = this.$route.params.id;
          this.getParentListById(id);
          this.getInfor(id);
        } else {
          this.dictionary = {};
        }
      },
      getParentList() {
        this.select = '';
        this.parentList = [];
        api_basic_setting.getParent(this.dictionary.lev)
          .then(Response => {
            this.parentList = Response.data.parentList;
          })
      },
      SaveOrUpdate(name) {
        this.$refs[name].validate((valid) => {
          if (valid) {
            if (this.dictionary.lev === 1) {
              this.dictionary.pid = 0;
            } else {
              this.dictionary.pid = this.select;
            }
            if (this.dictionary) {
              this.save();
            } else {
              this.update();
            }
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      save() {
        this.parentText = '1';
        api_basic_setting.saveDictionary(this.dictionary,this.parentText)
          .then(Response => {
            this.$message({
              message: "保存成功",
              type: "success"
            });
            this.$router.push({path: "/basic_setting/system_dictionary"});
          });
      },
      getInfor(id){
      api_basic_setting.getInforById(id)
        .then(Response => {
          this.dictionary = Response.data.dictionary;
          if (this.dictionary.pid !== 0)
            this.select = this.dictionary.pid;
        })
        console.log(this.dictionary)
        console.log(this.dictionary.pid)
        console.log(this.select)
      },
      update() {
        api_basic_setting.updateDictionary(this.dictionary,this.parentText)
          .then((response) => {
          this.$message({
            message: "修改成功",
            type: "success",
          });
          this.$router.push({ path: "/basic_setting/system_dictionary" });
        });
      },
      getParentListById(id){
        this.parentList = [];
        api_basic_setting.getParentById(id)
          .then(Response => {
            this.parentList = Response.data.parentList;

          })
      },
      jumpBack() {
        this.$router.push({path: "/basic_setting/system_dictionary"});
      }
    }
    }

</script>

<style scoped>

</style>
